<script setup lang="ts">
import { computed, reactive, ref } from 'vue';
import { router } from '../router';
import axios from '../axios'
import { ElMessage } from 'element-plus';
import Questions from '../components/Questions.vue';
import EditApprovers from '../components/EditApprovers.vue';

const templateId = computed(() => parseInt(<string> router.currentRoute.value.params.id))

</script>

<template>
    <div class="template-approver">
        <div class="template-approver-header">
        <el-page-header
            title="返回"
            @back="router.back()"
        >
            <template #content>
                审批人编辑
            </template>
        </el-page-header>
        </div>
        
        <el-divider />
        <div class="approver-wrap">
            <el-scrollbar>
                <EditApprovers :template-id="templateId" />
            </el-scrollbar>
        </div>
    </div>
</template>

<style scoped>
.template-approver {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.template-approver-header {
    width: calc(100% - 50px);
    padding-top: 20px;
}
.approver-wrap {
    flex: 1;
    width: 80%;
    overflow: auto;
}
</style>